/*
 * @Author: kakay
 * @Date: 2017-08-17 14:49:18
 * */

import React, { Component } from 'react';
import { List, Flex} from 'antd-mobile';
import { Resource } from '../../service/resource';
import BrowserUtils from '../../service/history';
import './index.scss';

const Item = List.Item;
export default class Project extends Component {
  constructor(props) {
    super(props);
    this.state = {
      projectList : []
    }
  }

  componentDidMount() {
    this.getProjects();
  }
  

  componentWillReceiveProps(nextProps) {
    nextProps.tag === 1 && this.getProjects();
  }

  getProjects() {
    Resource.getProjects.get().then(res => {
      this.setState({projectList:res})
    })
  }

  editProjectInfo(e, item) {
    e.preventDefault();
    item.status = '修改';
    BrowserUtils.push({pathname: '/addProject', state: {info: item,NavBarName:"工作量"}});
  }

  onTouchTapBack() {
    BrowserUtils.goBack();
  }

  render() {
    const {projectList} = this.state;
    return (
      <div className="project">
        <List className="my-list">
          <Item style={{background: '#ddd'}}>
            <Flex justify="between">
              <Flex.Item className="label name">项目</Flex.Item>
              <Flex.Item className="label">工时(月)</Flex.Item>
              <Flex.Item className="label">状态</Flex.Item>
              </Flex>
          </Item>
          {projectList.map((item, index) =>
            <Item style={{background: index % 2 === 0 ? "#fff" : "#eee" }} onLongPress={this.handleLongPress} className={item.valid === 0 ? 'valid' : ''} key={index} onTouchTap={e => this.editProjectInfo(e, item)}>
              <Flex justify="between">
                <Flex.Item className="label name">{item.name}</Flex.Item>
                <Flex.Item className="label">{item.workingHour===0?0:(item.workingHour/8/22).toFixed(2)}</Flex.Item>
                <Flex.Item className="label ">{item.state === 0 ? "进行中" : "已结束" }</Flex.Item>
              </Flex>
            </Item>
          )}
        </List>
      </div>
      
    );
  }
}

